<template>
    <el-form-item
        :label="`总代分组:`"
        :prop="prop"
		:required="true"
        :rules="[
            {
                required: true,
                message: '请选择总代分组',
                trigger: 'change'
            }
        ]"
    >
		<el-select
			:value="value"
			@change="handleInput"
		>
            <el-option
				v-for="item in groupList"
				:key="item.id"
				:label="item.groupName"
				:value="item.id"
			></el-option>
		</el-select>
    </el-form-item>
</template>
<script>
export default {
	name: 'AgenGroupSelect',
	props: {
        value: {
            type: [String, Number],
        },
        prop: {
            type: String,
            default: 'groupId'
        },
	},
	data() {
		return {
			title: this.$t('common.google_key'),
            groupList: []
		}
	},
	computed: {},
    created() {
        this.loadData()
    },
	methods: {
        handleInput(newVal) {
            this.$emit('input', newVal)
        },

        async loadData() {
            try {
                const res = await  this.$api.proxyGroupPageProxyGroup({
                    pageNum: 1,
                    pageSize: 999
                })
                if (res.code === 200) {
                    this.groupList = res?.data?.record || []
                }
            } catch(err) {
                console.error(err)
            }
           
        }
	
	}
}
</script>
<style lang="scss" scoped>
.d-flex {
	display: flex
}

</style>
